<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>函数的定义和调用</title>
	<!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
</head>
<body>
<script>
	// 定义函数
	// 方式一
	// function : 定义一个函数
	// abs : 函数名称
	// x : 函数参数
	// { ... } : 函数体
	function abs1(x) {
		if(x > 0) {
			return x;
		} else {
			return -x;
		}
	}

	// 方式二
	//function (x) {} 是一个匿名函数，没有函数名称
	//函数本身也是一个对象，通过赋值给abs2来实现函数的调用;
	var abs2 = function (x) {
		return x > 0 ? x : -x;
	};

	//函数的调用：js可以接受任意数量的参数，即使参数不存在也没问题
	var result = abs2(-10);
	var result1 = abs2(10,2,true);
	var result2 = abs2();
	console.log("result:" + result);
	console.log("result1:" + result1);
	console.log("result2:" + result2);

	//函数增强，进行类型检查
	function abs3(x) {
		if (typeof x !== "number") {
			throw "Not a number";
		}
		if (x > 0) {
			return x;
		} else  {
			return -x;
		}
	}
	var result3 = abs3(4);
	console.log("result3:" + result3);

	//js的 arguments 关键字
	function foo(x,y,z) {
		console.log("x=" + x + ",y=" + y + ",z=" + z);
		for (let i = 0; i < arguments.length; i++) {
			console.log("arg[" + i + "]=" + arguments[i]);
		}
	}

	foo("A",1,true);

	//rest参数 由于js函数可以接受任意数量的参数，所以不得不通过rest获得所有参数
	function rest(a, b) {
		var rest = [];
		if (arguments.length > 2) {
			for (let j = 2; j < arguments.length; j++) {
				rest.push(arguments[j]);
			}
		}
		console.log("a = " + a);
		console.log("b = " + b);
		console.log("rest = " + rest);
	}

	rest(1,true,"A","B");
	//传入的参数先绑定a,再绑定b, 剩余的绑定rest
	//es6的新语法
	function rest2(a, b, ...rest) {
		console.log("a = " + a);
		console.log("b = " + b);
		console.log("rest = " + rest);
	}

	rest2("小红","小兰","小紫",1,"A");
</script>
</body>
</html>